import React from 'react'
import Navigation from './Navigation'
import { Layout, Menu, Breadcrumb,Avatar,Dropdown,Select,BackTop  } from 'antd';
import User from './routes/User';
import SchoolRecruit from './routes/schoolRecruit';
import Score from './routes/Score';
import Number from './routes/Number';
import Knowledge from './routes/Knowledge';
import Policy from './routes/Policy';
import Choose from './routes/Choose';
import Guide from './routes/Guide';
import Book from './routes/Book';
import Circle from './routes/Circle';
import Usercoms from './routes/Usercoms';
import Check from './routes/Check';
import Word from './routes/Word';
import Wordhistory from './routes/Wordhistory';
import Message from './routes/Message';
import Compose from './routes/Compose';
import Collect from './routes/Collect';
import Examhistory from './routes/Examhistory';
import Studyhistory from './routes/Studyhistory';
import System from './routes/System';
import {DownOutlined} from '@ant-design/icons';
import './css/major.css'
import {useSelector,useDispatch,connect} from 'react-redux'
const { SubMenu } = Menu;
const { Header, Content, Footer} = Layout;


const Major = ({prop}) => {
  const status = useSelector(state => state.login.sta);
  const isLogin = useSelector(state => state.login.islogin);
  const dispatch = useDispatch();

  let guess;
  if(prop === 'user'){
    guess = <User />
  }else if(prop === 'schoolrecruit'){
    guess = <SchoolRecruit />
  }else if(prop === 'checkmes'){
    guess = <Check />
  }else if(prop === 'word'){
    guess = <Word />
  }else if(prop === 'wordhistory'){
    guess = <Wordhistory />
  }else if(prop === 'score'){
    guess = <Score />
  }else if(prop === 'number'){
    guess = <Number />
  }else if(prop === 'knowledge'){
    guess = <Knowledge />
  }else if(prop === 'policy'){
    guess = <Policy />
  }else if(prop === 'choose'){
    guess = <Choose />
  }else if(prop === 'guide'){
    guess = <Guide />
  }else if(prop === 'book'){
    guess = <Book />
  }else if(prop === 'circle'){
    guess = <Circle />
  }else if(prop === 'usercoms'){
    guess = <Usercoms />
  }else if(prop === 'message'){
    guess = <Message />
  }else if(prop === 'compose'){
    guess = <Compose />
  }else if(prop === 'like'){
    guess = <Collect />
  }else if(prop === 'examhistory'){
    guess = <Examhistory />
  }else if(prop === 'studyhistory'){
    guess = <Studyhistory />
  }else {
    guess = <System />
  }

  const exit = () => {
    dispatch({type:'exit'})
  }
  const menu = (
    <Menu>
    <Menu.Item danger onClick={exit}>退出</Menu.Item>
  </Menu>
  );
    return (
    <Layout>
    <Header className="header">
      <div className="logo" />
      <h2 className="titleName">上岸后台管理系统</h2>
      <div className="admin">
        <div>
        <Avatar src={status.adminImg} className="admin-pic"/>
        </div>
        <Dropdown overlay={menu} className="admin-info">
          <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
          {status.username} <DownOutlined />
          </a>
  </Dropdown>
      </div>
    </Header>
    <Content style={{ padding: '0 50px' }}>
      <Breadcrumb style={{ margin: '15px 0' }}>
      </Breadcrumb>
      <Layout className="site-layout-background" style={{ padding: '20px 0' }}>   
        <Navigation />  
        {guess}
        
      </Layout>
    </Content>
    <Footer style={{ textAlign: 'center' }}>@2022 逆局小组所有</Footer>
    <BackTop visibilityHeight={150}/>
  </Layout>
    )
}

export default connect()(Major)